:root {
   --easing: cubic-bezier(0.22, 1, 0.36, 1);
}

.fade-in {
   animation: fade-kf 300ms var(--easing);
}

.fade-out {
   animation: fade-kf 300ms var(--easing);
}

.fade-all {
   animation: fade-kf 600ms var(--easing) forwards;
}

@keyframes fade-kf {
   0% {
      opacity: 1;
   }
   100% {
      opacity: 0;
   }
}

.fade-in-test-prop {
   animation: fade-kf 800ms ease-in-out;
}

.fade-in-test-prop {
   animation: fade-kf 800ms ease-in-out;
}
